<template>
    <div class="home">
      <!-- 输入框 -->
  
      <!-- 轮播图 -->
  
      <!-- 店铺列表 -->
      <div class="shoplist">
        <div @click="toDetail(item)" class="shop" v-for="(item,index) in shoplist" :key="index">
          <div class="imgbox">
            <img :src="item.picUrl" alt="">
          </div>
          <div class="text">
            <div class="name">{{item.name}}</div>
            <div class="sale"> ☆ {{item.wmPoiScore/10}} {{item.monthSalesTip}}</div>
            <div class="desc">{{item.minPriceTip}} {{item.shippingFeeTip}}</div>
          </div>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import { shop_list } from '../../utils/api'
  
  export default {
    data(){
      return {
        shoplist:[]
      }
    },
    mounted(){
      shop_list().then((res)=>{
        this.shoplist = res.data.list
      })
    },
    methods:{
      toDetail(item){ //跳转到详情页
        this.$router.push('/detail/'+item.mtWmPoiId);
      }
    }
  }
  </script>
  
  <style lang='scss' scoped>
  .shoplist{
    margin: 10px;
    .shop{
      display: flex;
      margin: 10px 0;
      .imgbox{
        width: 80px;
        margin-right: 10px;
        img{
          width: 100%;
        }
      }
      .text{
        font-size: 12px;
      }
    }
  }
  </style>